export function FlowingSupport (graph) {
  this.flowMap = {}
  this.graph = graph
}
  FlowingSupport.prototype = {
    flowMap: null,
    length: 0,
    gap: 40,
    graph: null,
    addFlowing: function (edgeOrLine, count, byPercent) {
      var flowList = this.flowMap[edgeOrLine.id]
      if (!flowList) {
        flowList = this.flowMap[edgeOrLine.id] = []
        this.length++
      }
      count = count || 1
      while (--count >= 0) {
        var ui = new Q.ImageUI('/static/img/flow.png')
        ui.layoutByPath = true
        ui.position = {x: 0, y: 0}
        ui.size = {width: 30}
        ui.renderColor = '#0cff14'
        flowList.push(ui)
        flowList.byPercent = byPercent
        edgeOrLine.addUI(ui)
      }
    },
    removeFlowing: function (id) {
      var flowList = this.flowMap[id]
      if (!flowList) {
        return
      }
      var edgeOrLine = this.graph.getElement(id)
      if (edgeOrLine) {
        flowList.forEach(function (ui) {
          edgeOrLine.removeUI(ui)
        })
      }
      this._doRemove(id)
    },
    _doRemove: function (id) {
      delete this.flowMap[id]
      this.length--
    },
    timer: null,
    perStep: 10,
    stop: function () {
      clearTimeout(this.timer)
    },
    start: function () {
      if (this.timer) {
        clearTimeout(this.timer)
      }
      var offset = 0
      var scope = this
      scope.timer = setTimeout(function A() {
        if (!scope.length) {
          scope.timer = setTimeout(A, 2000)
          offset = 0
          return
        }
        offset += 1
        for (var id in scope.flowMap) {
          var ui = scope.graph.getUI(id)
          if (!ui) {
            scope._doRemove(id)
            continue
          }
          var lineLength = ui.length
          if (!lineLength) {
            continue
          }
          var flowList = scope.flowMap[id]
          if (flowList.byPercent) {
            var x = offset * 2
            var gap = 15
            scope.flowMap[id].forEach(function (ui) {
              ui.position = {x: (x % 100) / 100, y: 0}
              x += gap
            })
          } else {
            var x = offset * scope.perStep
            scope.flowMap[id].forEach(function (ui) {
              ui.position = {x: x % lineLength, y: 0}
              x += scope.gap
            })
          }
          scope.graph.invalidateUI(ui)

          // dashed line
          var data = ui.data
          if (data instanceof Q.Edge) {
            if (data.getStyle(Q.Styles.EDGE_LINE_DASH)) {
              data.setStyle(Q.Styles.EDGE_LINE_DASH_OFFSET, -offset)
            }
          } else if (data instanceof Q.ShapeNode) {
            if (data.getStyle(Q.Styles.SHAPE_LINE_DASH)) {
              data.setStyle(Q.Styles.SHAPE_LINE_DASH_OFFSET, -offset)
            }
          }
        }
        scope.timer = setTimeout(A, 200)
      }, 200)
    }
  }

